<template>
  <el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible" width=80%>

    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()"
      label-width="100px">
      <el-row>
        <el-col :span="8">
          <el-form-item label="姓名" prop="name">
            <el-input v-model="dataForm.name" placeholder="请输入姓名" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="身份证号" prop="identityId">
            <el-input v-model="dataForm.identityId" placeholder="请输入身份证号" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="性别" prop="gender">
            <el-select v-model="dataForm.gender" clearable placeholder="性别" style="width: 200px;">
              <el-option v-for="item in genderType" :key="item.key" :label="item.value" :value="item.key">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="出生日期" prop="birthDate">
            <el-date-picker v-model="dataForm.birthDate" type="date" value-format="yyyy-MM-dd" placeholder="选择日期"
              style="width: 200px;">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="精神关爱" prop="isLove">
            <el-select v-model="dataForm.isLove" clearable placeholder="精神关爱">
              <el-option v-for="item in needType" :key="item.key" :label="item.value" :value="item.key"
                style="width: 200px;">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="物资关爱" prop="isMaterial">
            <el-select v-model="dataForm.isMaterial" clearable placeholder="物资关爱">
              <el-option v-for="item in needType" :key="item.key" :label="item.value" :value="item.key"
                style="width: 200px;">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="籍贯" prop="origin">
            <el-input v-model="dataForm.origin" placeholder="请输入籍贯" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="护理人姓名" prop="nurseName">
            <el-input v-model="dataForm.nurseName" placeholder="请输入护理人姓名" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="护理人电话" prop="nurseTel">
            <el-input v-model="dataForm.nurseTel" placeholder="请输入护理人电话" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="护理类别" prop="nurseGrade">
            <el-select style="width: 200px;margin-left: 20px" v-model="dataForm.nurseGrade" clearable
              placeholder="护理类别">
              <el-option v-for="item in nurseType" :key="item.key" :label="item.value" :value="item.key">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="家庭情况" prop="familyDetail">
            <el-input v-model="dataForm.familyDetail" placeholder="家庭情况" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="取凉情况" prop="coolDetail">
            <el-input v-model="dataForm.coolDetail" placeholder="取凉情况" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="取暖情况" prop="warmDetail">
            <el-input v-model="dataForm.warmDetail" placeholder="取暖情况" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="本人电话" prop="tel">
            <el-input v-model="dataForm.tel" placeholder="本人电话" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="卫生情况" prop="hygieneDetail">
            <el-input v-model="dataForm.hygieneDetail" placeholder="卫生情况" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="经济来源" prop="economicSource">
            <el-input v-model="dataForm.economicSource" placeholder="经济来源" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="居住生活情况" prop="resideDetail">
            <el-input v-model="dataForm.resideDetail" placeholder="居住生活情况" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="服药情况" prop="medicationDetail">
            <el-input v-model="dataForm.medicationDetail" placeholder="服药情况" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="健康情况" prop="healthyDetail">
            <el-input v-model="dataForm.healthyDetail" placeholder="健康情况" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="居住地址" prop="address">
            <el-input v-model="dataForm.address" placeholder="居住地址" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="邻里关系" prop="neighborDetail">
            <el-input v-model="dataForm.neighborDetail" placeholder="邻里关系" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="乡干部姓名" prop="villageName">
            <el-input v-model="dataForm.villageName" placeholder="乡干部姓名" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="乡干部电话" prop="villageTel">
            <el-input v-model="dataForm.villageTel" placeholder="乡干部电话" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="类别" prop="categoryId">
            <el-select style="width: 150px;margin-left: 20px" v-model="dataForm.categoryId" clearable
              placeholder="受助类别">
              <el-option v-for="item in categorys" :key="item.id" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="镇干部姓名" prop="townName">
            <el-input v-model="dataForm.townName" placeholder="镇干部姓名" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="镇干部电话" prop="townTel">
            <el-input v-model="dataForm.townTel" placeholder="镇干部电话" style="width: 200px;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="对接人" prop="fellowName">
            <el-select style="width: 200px;margin-left: 20px" v-model="dataForm.fellowId" filterable clearable
              placeholder="对接人">
              <el-option v-for="item in fellows" :key="item.id" :label="item.name + ' ' + item.tel" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-form-item label="备注" prop="reamrk">
          <el-input v-model="dataForm.reamrk" placeholder="备注" style="width: 500px;"></el-input>
        </el-form-item>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import request from '@/utils/httpRequest'

export default {
  data() {
    return {
      categorys: [
        {
          id: 0,
          name: ''
        }
      ],
      fellows: [
        {
          id: 0,
          name: '',
          tel: ''
        }
      ],
      nurseType: [
        {
          key: 0,
          value: '全自理'
        },
        {
          key: 1,
          value: '半失能'
        },
        {
          key: 2,
          value: '失能'
        },
        {
          key: 3,
          value: '正常'
        }
      ],
      genderType: [
        {
          key: 0,
          value: '男'
        },
        {
          key: 1,
          value: '女'
        }
      ],
      needType: [
        {
          key: 0,
          value: '不需要'
        },
        {
          key: 1,
          value: '需要'
        },
        {
          key: 2,
          value: '待观察'
        },
      ],
      visible: false,
      dataForm: {
        id: 0,
        name: '',
        identityId: '',
        gender: '',
        birthDate: '',
        isLove: '',
        isMaterial: '',
        origin: '',
        nurseName: '',
        nurseTel: '',
        nurseGrade: '',
        familyDetail: '',
        coolDetail: '',
        warmDetail: '',
        age: '',
        hygieneDetail: '',
        economicSource: '',
        resideDetail: '',
        residePic: '',
        medicationDetail: '',
        healthyDetail: '',
        address: '',
        neighborDetail: '',
        tel: '',
        reamrk: '',
        villageName: '',
        villageTel: '',
        townTel: '',
        townName: '',
        pic: '',
        fellowId: '',
        fellowName: '',
        fellowTel: '',
        categoryId: '',
        categoryName: ''
      },
      dataRule: {
        name: [
          { required: true, message: '姓名不能为空', trigger: 'blur' }
        ],
        isLove: [
          { required: true, message: '是否需要精神关爱不能为空', trigger: 'blur' }
        ],
        isMaterial: [
          { required: true, message: '是否需要物资关爱不能为空', trigger: 'blur' }
        ],
        nurseGrade: [
          { required: true, message: '护理类别不能为空', trigger: 'blur' }
        ],
        categoryId: [
          { required: true, message: '类别不能为空', trigger: 'blur' }
        ],
        gender: [
          { required: true, message: '性别不能为空', trigger: 'blur' }
        ],
        birthDate: [
          { required: true, message: '出生日期不能为空', trigger: 'blur' }
        ]
      }
    }
  },

  methods: {
    getFellows() {
      request.get('/lovehelp/fellow/allFellowInfo').then((response) => {
        if (response && response.code === 200) {
          this.fellows = response.fellowVoInfo
        } else {
          this.fellows = []
        }
      }).catch((error) => {
        console.error(error)
      })
    },
    getCategorys() {
      request.get('/lovehelp/category/allcategory').then((response) => {
        if (response && response.code === 200) {
          this.categorys = response.categorys
        } else {
          this.categorys = []
        }
      }).catch((error) => {
        console.error(error)
      })
    },
    init(id) {
      this.getFellows()
      this.getCategorys()
      this.dataForm.id = id || 0
      this.visible = true
      this.$nextTick(() => {
        this.$refs['dataForm'].resetFields()
        if (this.dataForm.id) {
          request.get(`/lovehelp/recipient/info/${this.dataForm.id}`, {}).then((response) => {
            if (response && response.code === 200) {
              this.dataForm.name = response.recipient.name
              this.dataForm.identityId = response.recipient.identityId
              this.dataForm.gender = response.recipient.gender
              this.dataForm.birthDate = response.recipient.birthDate
              this.dataForm.isLove = response.recipient.isLove
              this.dataForm.isMaterial = response.recipient.isMaterial
              this.dataForm.origin = response.recipient.origin
              this.dataForm.nurseName = response.recipient.nurseName
              this.dataForm.nurseTel = response.recipient.nurseTel
              this.dataForm.nurseGrade = response.recipient.nurseGrade
              this.dataForm.familyDetail = response.recipient.familyDetail
              this.dataForm.coolDetail = response.recipient.coolDetail
              this.dataForm.warmDetail = response.recipient.warmDetail
              this.dataForm.age = response.recipient.age
              this.dataForm.hygieneDetail = response.recipient.hygieneDetail
              this.dataForm.economicSource = response.recipient.economicSource
              this.dataForm.resideDetail = response.recipient.resideDetail
              this.dataForm.residePic = response.recipient.residePic
              this.dataForm.medicationDetail = response.recipient.medicationDetail
              this.dataForm.healthyDetail = response.recipient.healthyDetail
              this.dataForm.address = response.recipient.address
              this.dataForm.neighborDetail = response.recipient.neighborDetail
              this.dataForm.tel = response.recipient.tel
              this.dataForm.reamrk = response.recipient.reamrk
              this.dataForm.villageName = response.recipient.villageName
              this.dataForm.villageTel = response.recipient.villageTel
              this.dataForm.townTel = response.recipient.townTel
              this.dataForm.townName = response.recipient.townName
              this.dataForm.pic = response.recipient.pic
              this.dataForm.fellowId = response.recipient.fellowId
              this.dataForm.fellowName = response.recipient.fellowName
              this.dataForm.fellowTel = response.recipient.fellowTel
              this.dataForm.categoryId = response.recipient.categoryId
              this.dataForm.categoryName = response.recipient.categoryName
            }
          }).catch((error) => {
            // 处理错误  
            console.error(error);
          });
        }
      })
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          request.post(`/lovehelp/recipient/${!this.dataForm.id ? 'save' : 'update'}`, {
            'id': this.dataForm.id || undefined,
            'name': this.dataForm.name,
            'identityId': this.dataForm.identityId,
            'gender': this.dataForm.gender,
            'birthDate': this.dataForm.birthDate,
            'isLove': this.dataForm.isLove,
            'isMaterial': this.dataForm.isMaterial,
            'origin': this.dataForm.origin,
            'nurseName': this.dataForm.nurseName,
            'nurseTel': this.dataForm.nurseTel,
            'nurseGrade': this.dataForm.nurseGrade,
            'familyDetail': this.dataForm.familyDetail,
            'coolDetail': this.dataForm.coolDetail,
            'warmDetail': this.dataForm.warmDetail,
            'hygieneDetail': this.dataForm.hygieneDetail,
            'economicSource': this.dataForm.economicSource,
            'resideDetail': this.dataForm.resideDetail,
            'medicationDetail': this.dataForm.medicationDetail,
            'healthyDetail': this.dataForm.healthyDetail,
            'address': this.dataForm.address,
            'neighborDetail': this.dataForm.neighborDetail,
            'tel': this.dataForm.tel,
            'reamrk': this.dataForm.reamrk,
            'villageName': this.dataForm.villageName,
            'villageTel': this.dataForm.villageTel,
            'townTel': this.dataForm.townTel,
            'townName': this.dataForm.townName,
            'fellowId': this.dataForm.fellowId,
            'categoryId': this.dataForm.categoryId,
            'isDisplay': 1

          }).then((response) => {
            if (response && response.code === 200) {
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                  this.visible = false
                  this.$emit('refreshDataList')
                }
              })
            } else {
              this.$message.error(response.msg)
            }
          }).catch((error) => {
            // 处理错误  
            console.error(error);
          });
        }
      })
    }
  }
}
</script>
